<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
	<!-- <link rel="icon" href=""> -->
	<title>发送群组sop</title>
	<meta content="yes" name="apple-touch-fullscreen">
	<meta content="yes" name="apple-mobile-web-app-capable">
    <link rel="stylesheet" href="/static/wework/h5/css/format.css">
	<style>
		body{
			background: #f8f8f8;
		}
		/*公共列表部分*/
		.public_PeopleList_container{
			background: #fff;
		}
		.public_PeopleList_header_container{
			display: flex;
			align-items: center;
			padding-top: .32rem;
			padding-left: .32rem;
		}
		.public_PeopleList_header_container svg{
			width: .35rem;
			height: .35rem;
		}
		.public_PeopleList_header_container p{
			font-size: .28rem;
			color: #2c2c2c;
		}
		.public_PeopleList_main_container{

		}
		.public_PeopleList_main_content{

		}
		.public_PeopleList_main_content li{
			padding: .35rem .32rem .32rem .32rem;
			border-bottom: 1px solid #f8f8f8;
		}
		/*sop*/
		.mobileSendSOP_Header_container{
			background: #fff;
			margin-bottom: .2rem;
			padding: .32rem;
		}
		.mobileSendSOP_listHeader_container{
			display: flex;
			align-items: center;
		}
		.mobileSendSOP_Tips_container{
			background: #f1f8ff;
			border: 1px solid #cbe5fc;
			padding: .24rem;
		}
		.mobileSendSOP_Tips_container p{
			color: #111;
			font-size: .26rem;
		}
		.mobileSendSOP_title_container{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: .22rem 0;
		}
		.mobileSendSOP_title_container span{
			color: #000;
			font-size: .3rem;
			font-weight: bold;
			position: relative;
			padding-left: .2rem;
		}
		.mobileSendSOP_title_container span::before{
			content: "";
			position: absolute;
			left: 0;
			top: .06rem;
			width: .08rem;
			height: .3rem;
			background: #4090fe;
		}
		.mobileSendSOP_titleRight_container{
			display: flex;
			align-items: center;
		}
		.mobileSendSOP_titleRight_container input{

		}
		.mobileSendSOP_titleRight_container p{
			font-size: .28rem;
			color: #333;
		}
		.mobileSendSOP_remind_container{
			background: #f1f8ff;
			padding: .1rem 0;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: .26rem;
			color: #333;
		}
		.mobileSendSOP_remind_container p span{
			color: #3a92f6;
		}
		.mobileSendSOP_listFooter_container{
			/*display: flex;*/
			align-items: center;
			margin-top: .1rem;
		}
		.mobileSendSOP_listFooter_container p{
			flex: 1;
			color: #333;
			padding-right: .2rem;
			font-size: .28rem;
		}
		.mobileSendSOP_listOther_container{
			display: flex;
			justify-content: flex-end;
		}
		.mobileSendSOP_listOther_container{
			margin-top: .2rem;
		}
		.mobileSendSOP_listHeader_container img{
			width: 1rem;
			height: 1rem;
			border-radius: 4px;
		}
		.mobileSendSOP_listHeader_container a{
			
		}

		.public_copyButton{
			font-size: .24rem;
			color: #207df5;
			background: #edf6fe;
			border:1px solid #d7e8fc;
			padding: 0 .13rem;
			border-radius: 3px;
			height: .5rem;
			line-height: .5rem;
			cursor: pointer;
		}
		/**/
		.public_PeopleList_mainInfo_container{
			flex: 1;
			display: flex;
			flex-direction: column;
			padding-left: .24rem;
			height: 1rem;
			justify-content: space-around;
		}
		.public_PeopleList_mainInfo_container p:first-child{
			font-size: .30rem;
			color: #000;
			font-weight: bold;
		}
		.public_PeopleList_mainInfo_container p{
			color: #999999;
			font-size: .24rem;
		}
		.public_PeopleList_footer_container{
			padding: .32rem;
		}
		.public_PeopleList_footer_container p{
			font-size: .28rem;
			color: #999;
			text-align: center;
		}
	</style>

</head>
<body>
	<div class="mobileSendSOP_Header_container">
		<div class="mobileSendSOP_Tips_container">
			<p>管理员创建了朋友圈，提醒你去发送哦</p>
		</div>
	</div> 
	<!-- 公共列表部分 -->
	<div class="public_PeopleList_container">
		<div class="public_PeopleList_main_container">
			<ul class="public_PeopleList_main_content">
				<li>
					<div class="mobileSendSOP_listHeader_container">
						<div class="public_PeopleList_mainInfo_container">
							<p>朋友圈内容：</p> 
							<p>{$res['text']}</p> 
						</div>
						<a class="public_copyButton copySvg" data-clipboard-text="{$res['text']}">复制</a>
					</div>
					<div class="mobileSendSOP_listFooter_container" style="padding-top:30px;padding-bottom:30px;">
						{if $res["content"]["type"] == 1}
						图片：
							{foreach $res["content"]["image_list"] as $image}
								<p><img class='' src='{$image}' style='width:70px;'></span><a style="float: right" class="public_copyButton copySvg"data-clipboard-text="{$image}" >复制图片</a></p>
							{/foreach}
						{/if}
						{if $res["content"]["type"] == 2}
						文本：
							{foreach $text as $texts}
								<p>{$texts}<a class="public_copyButton copySvg" style="float: right" data-clipboard-text="{$texts}">复制文本</a></p><br>
							{/foreach}
						{/if}
						{if $res["content"]["type"] == 3}
						链接： <p>{$res["content"]["link_url"]}<a class="public_copyButton copySvg" style="float: right" data-clipboard-text='{$res["content"]["link_url"]}'>复制链接</a></p><br>
						{/if}<br>
					</div>
				</li>
			</ul>
		</div>
	</div>
	<!-- 复制粘贴 -->
	<script src="/static/wework/h5/js/ajax.js"></script>
	<script src="/static/wework/h5/js/clipboard.js"></script>
	<script src="/static/wework/h5/layui/layui.js"></script>
	<script src="/static/wework/h5/layui/layui.all.js"></script>
	<script>
		var clipboard = new ClipboardJS('.copySvg');

		clipboard.on('success', function(e) {
			layer.msg("复制成功");
			// console.info(e.text);
		});

		clipboard.on('error', function(e) {
			console.error('Action:', e.action);
			console.error('Trigger:', e.trigger);
		});
		
	</script>
</body>

</html>
	